<template>
    <view :class="$style.header">
        <view v-if="isback" :class="$style.back" @click="back">
            <uni-icons type="arrow-left" size="30" color="#000"></uni-icons>
        </view>
        <view style="flex: 1;">
            <slot></slot>
        </view>
        <navigator v-if="showSearch" url="/pages/search">
            <uni-icons type="search" size="25"></uni-icons>
        </navigator>
    </view>
</template>

<script lang="ts" setup>
    import { ref } from 'vue';
    const isback = ref(false)
    var pages = getCurrentPages();

    const props = withDefaults(defineProps<{
        showSearch : boolean
    }>(), {
        showSearch : true
    })


    if(pages.length > 1) {
        isback.value = true
    }

    function back() {
        uni.navigateBack()
    }
</script>

<style module lang="scss">

.header {
	padding: $base-space $base-space;
    display: flex;
    align-items: center;

    background: url(@/static/header-bc.png) no-repeat;
    background-size: cover;
}
.back{
    margin-right: 20rpx;
}
</style>